<template>
    <div>
        <Row>
            <Col>
                <avatar v-bind:src="userAvatar" size="150"></avatar>
                <p style="position: center">{{ User.nickName }}</p>
            </Col>
        </Row>
        <Card>
            <p>简介:{{ User.userBrief }}</p>
            <p>生日:{{ User.birthday }}</p>
            <p>住址:{{ User.location }}</p>
        </Card>
        <Row>
            <Card>
                <p slot="title">{{User.signUpDate}}来到海淘~已经卖出{{User.soldNum}}件商品了</p>
                <Row type="flex" align="middle">物流服务 :
                    <Rate disabled allow-half v-model="User.logisticsLevel"/>
                    {{User.logisticsLevel}}
                </Row>
                <Row type="flex" align="middle">商品质量 :
                    <Rate disabled allow-half v-model="User.productLevel"/>
                    {{User.productLevel}}
                </Row>
                <Row type="flex" align="middle">卖家服务 :
                    <Rate disabled allow-half v-model="User.serviceLevel"/>
                    {{User.serviceLevel}}
                </Row>
            </Card>
        </Row>
        <Button type="error" @click="readyLogOut">注销</Button>
        <Modal
                v-model="logOutCheck"
                title="确认注销？"
                @on-ok="ok"
                @on-cancel="cancel">
            <p>您还可以再逛逛</p>
        </Modal>
    </div>
</template>

<script>
    import axios from "axios";
    import globalData from "@/utils/globalData";

    export default {
        name: "PersonalCenterMainPage",
        data() {
            return {
                valueDisabled: 4.5,
                logOutCheck: false,
                userId: 0,
                userAvatar: globalData.userAvatar,
                User: {
                    userName: "",
                    userPassword: "",
                    nickName: "",
                    userBrief: "",
                    male: "secret",
                    email: "",
                    birthday: "",
                    location: "",
                    signUpDate: '',
                    logisticsLevel: '',
                    productLevel: '',
                    serviceLevel: '',
                    soldNum: ''
                },
                alreadyDays: 0
            }
        },
        methods: {
            ok() {
                this.$router.replace("/")
            },
            cancel() {

            },
            readyLogOut() {
                this.logOutCheck = true
            }
        },
        created: function () {
            this.userId = globalData.USER.userId
            let self = this
            axios({
                method: 'get',
                url: '/user/' + this.userId,
            }).then(function (res) {
                self.User = res.data
                console.log(self.User)
                self.User.birthday = self.User.birthday.slice(0, 10)
                self.User.signUpDate = self.User.signUpDate.slice(0, 10)
                self.alreadyDays = new Date().getDay() - self.User.signUpDate
            });
        },
    }
</script>

<style scoped>

</style>